import React, { FC, useEffect, useState } from 'react'
import { useRequest } from '@umijs/max';
import { queryShortComments, createShortComments } from '../../service'
import CommitInput from './CommitInput'
import CommitItem from './CommitItem'

const Commen: FC<any> = ({ current }) => {

  useEffect(() => {
    if (current?.id) {
      queryComment(current.id)
    }
  }, [])

  const { data = [], run: queryComment } = useRequest(queryShortComments, {
    manual: true,
  });

  const { run: createComment } = useRequest(createShortComments, {
    manual: true,
    onSuccess(data, params) {
      queryComment(current.id)
    },
  });

  const getInputContent = (content: any) => {
    const data = {
      shot_id: current?.id,
      comment: content
    }
    createComment(data)
  }

  return (
    <div style={{ width: '240px' }}>
      <CommitItem giveDataToCommitItem={data} />
      <CommitInput getInputContent={(content: any) => getInputContent(content)} />
    </div >
  )

}

export default Commen